<template>
	<view class="content">
		<view class="title1">Hello</view>
		<view class="title2">有什么好的意见可以分享一下哦~</view>

		<view class="cont-box">
			<view class="fknr">反馈内容
				<!-- <image class="xing-icon" src="@/static/img/xingxing.png"></image> -->
			</view>
			<view class="tetxBox">
				<u--textarea v-model="model.context" class="textarea_ipt" placeholderClass="textarea_u"
					placeholder="请填写10个字以上的内容，以便我们为您提供更好的内容" height="300rpx"></u--textarea>
				<!-- <view class="upload-box">
					<u-upload :fileList="fileListObj" :sizeType="['compressed']" @afterRead="afterRead($event)"
						@delete="deletePic($event)" :previewFullImage="true" :previewImage="true" name="1" multiple :maxCount="1"
						width="180rpx" height="180rpx"></u-upload>
						
					
				</view> -->

			</view>
		</view>
		<view class="title-3">您的意见对我们非常重要，我们会不断的进步，以给您带来更好的体验。</view>



		<view class="btn-box">
			<view class="btn" @click="submitBtn">提交</view>
		</view>
	</view>
</template>

<script>
	
	import {
		feedBack
	} from '@/api/common'
	import {
		baseURL1,
		baseURL
	} from "@/api/config.js";
	export default {
		data() {
			return {
				value2: '',
				fileList: [],
				fileListObj: [],
				model:{
					context:'', 
				}
			}
		},
		components: {

		},

		onLoad(option) {

		},
		onShow() {

		},

		methods: {


			// 立即提交
			goHome() {

				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			// 删除 轮播
			deletePic(file) {
				console.log(file, '删除照片')
				this.fileList.splice(file.index, 1)
				this.fileListObj.splice(file.index, 1)
			},
			// 新增图片 轮播
			async afterRead(event) {
				console.log('图片', event)
				let files = event.file
				for (let i = 0; i < files.length; i++) {
					// const isLt200K = files[i].size / 1024 < 2048;
					// if (!isLt200K) {
					// 	uni.$u.toast('图片大小不能超过 2M!');
					// 	return false;
					// }
					const result = await this.uploadFilePromise(files[i].url)
					console.log(JSON.parse(result))
					let res = JSON.parse(result)
					this.fileList.push({
						url: res.data.url
					})
					this.fileListObj.push({
						url: res.data.url
					})
				}
			},
			uploadFilePromise(url) {
				uni.showLoading({
					title: '加载中'
				});
				let token = uni.getStorageSync('userToken') || '';
			
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: baseURL1 + `/common/upload`,
						filePath: url,
						name: 'file',
						header: {
							'Authorization': 'Bearer ' + token,
							"Content-Type": "application/x-www-form-urlencoded",
						},
						formData: {},
						success: (res) => {
							setTimeout(() => {
								resolve(res.data)
							}, 1000)
						},
						complete: (result) => {
							// console.log('99999999999999999999',json.parse(result.data))
							uni.hideLoading();
						}
					});
				})
			},
			submitBtn() {
				let _this = this
				let data = this.model
				data.userId = uni.getStorageSync('userId')
				if (!data.context) {
					uni.$u.toast(`请输入反馈内容`)
					return
				}
				  
				console.log(data)
				// return
				uni.showModal({
					title: '提示',
					content: '确定提交',
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							_this.submit(data)
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			submit(data) {
				uni.showLoading({
					title: '加载中'
				});
				feedBack(data).then(res => {
					uni.hideLoading();
					uni.$u.toast(res.msg)
					if (res.code == 200) {
						setTimeout(() => {
							uni.navigateBack()
						}, 1000)
					}
				}).catch(err => {
					uni.hideLoading();
				})
			}



		}
	}
</script>

<style lang="less" scoped>
	.content {
		box-sizing: border-box;
		position: relative;
		font-family: PingFang SC, PingFang SC;
		padding-bottom: 180rpx;
		box-sizing: border-box;
		

		.title1 {
			font-weight: bold;
			font-size: 56rpx;
			color: #222222;
			margin-top: 40rpx;
			padding-left: 56rpx;
		}

		.title2 {
			font-weight: 500;
			font-size: 28rpx;
			color: #444444;
			padding-left: 56rpx;
		}

		.cont-box {
			padding: 0 25rpx;
			padding-top: 40rpx;

			.fknr {
				width: 188rpx;
				height: 60rpx;
				font-weight: bold;
				font-size: 28rpx;
				color: #F9F4EA;
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				background: linear-gradient(to right, #006C04 0%, #C1FDDD 70%, #C6FED7 100%);
				border-top-left-radius: 16rpx;

				.xing-icon {
					width: 24rpx;
					height: 24rpx;
					position: absolute;
					top: 0;
					right: 18rpx;
				}
			}

			.tetxBox {
				background: #FFFFFF;
				border-radius: 0rpx 16rpx 16rpx 16rpx;

				.textarea_u {
					font-weight: 500;
					font-size: 28rpx;
					color: #CCCCCC;
				}

				.textarea_ipt {}

				::v-deep .u-textarea {
					border: none;
					padding: 30rpx;
				}
				.upload-box {
					padding: 30rpx;
				}
			}
		}
		.title-3 {
			font-weight: 500;
			font-size: 20rpx;
			color: #999999;
			margin-top: 20rpx;
			padding: 0 56rpx;
		}


		.btn-box {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 0;
			padding: 0 115rpx;
			padding-bottom: calc(10rpx + constant(safe-area-inset-bottom));
			padding-bottom: calc(10rpx + env(safe-area-inset-bottom));
		
			.btn {
				height: 90rpx;
				// background: #2DD1AC;
				background: #006C04;
				border-radius: 120rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-weight: bold;
				font-size: 30rpx;
				color: #FFFFFF;
			}
		}





	}
</style>